
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="title" content="网站">
<meta name="description" content="LayoutIt! 可拖放排序在线编辑的Bootstrap可视化布局系统">
<meta name="keywords" content="可视化,布局,系统">
<title>Bootstrap可视化布局系统</title>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css">

<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="http://www.bootcss.com/p/unslider/style.css">


<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="js/unslider.min.js"></script>

</head>

 <body>
	<div class="container-fluid" >
		<div class="row">
			<nav class="navbar navbar-default " role="navigation">
			 <div class="container-fluid">
				<div class="navbar-header">
				  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				  </button>
				  <a class="navbar-brand" href="#">企业LOGO</a>
				</div>
				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					  <ul class="nav navbar-nav navbar-right">
						<li class="active"><a href="#">网站首页</a></li>
						<li><a href="#">公司简介</a></li>
						<li><a href="#">新闻动态</a></li>
						<li class="dropdown">
						  <a href="#" class="dropdown-toggle" data-toggle="dropdown">产品系列<span class="caret"></span></a>
						  <ul class="dropdown-menu" role="menu">
							<li><a href="#">Action</a></li>
							<li><a href="#">Another action</a></li>
							<li><a href="#">Something else here</a></li>
							<li class="divider"></li>
							<li><a href="#">Separated link</a></li>
							<li class="divider"></li>
							<li><a href="#">One more separated link</a></li>
						  </ul>
						</li>
						<li><a href="#">品牌加盟</a></li>
						<li><a href="#">人才招聘</a></li>
						<li><a href="#">联系我们</a></li>
						<li><a href="#">信息反馈</a></li>
					  </ul>
			 </div>
  </div>
</nav>
	</div>

<div class="row" style="margin-bottom:20px;">
			<div class=" banner has-dots "  >
				<ul >
					<li style="width: 100%; background-image: url(img/sunset.jpg);">
						<div class="inner">
						<h1>1</h1>
						<p>就是这个不到3kb的插件！没有奇特的特效或无用的标签。</p>
						</div>
					</li>
					<li  style="width: 100%;background-image: url(img/wood.jpg); ">
					  <div class="inner">
						<h1>2</h1>
						<p>就是这个不到3kb的插件！没有奇特的特效或无用的标签。</p>
						</div>
					</li>
					<li style="width: 100%;background-image: url(img/subway.jpg); ">
						<div class="inner">
						<h1>3</h1>
						<p>就是这个不到3kb的插件！没有奇特的特效或无用的标签。</p>
						</div>
					</li>
				</ul>
			</div>
	</div>

	<div class="row">
			<div class="col-md-4">
				 <div class="panel panel-primary">
					 <div class="panel-heading">
						<h3 class="panel-title"><span class="glyphicon glyphicon-hand-up"></span>公司新闻</h3>
					  </div>
					  <div class="panel-body">
								 <p> <a>1.Panel content</a></p>
								 <p> <a>2.Panel content</a></p>
								 <p> <a>3.Panel content</a></p>
								 <p> <a>4.Panel content</a></p>
								 <p> <a>5.Panel content</a></p>
								 <p> <a>6.Panel content</a></p>
								 <p> <a>7.Panel content</a></p>
								 <p> <a>8.Panel content</a></p>
								 <p> <a>9.Panel content</a></p>
								 <p> <a>10.Panel content</a></p>
					  </div>
				 </div>
			</div>	
			<div class="col-md-4">
				<div class="panel panel-success">
					<div class="panel-heading">
						<h3 class="panel-title">最新动态</h3>
					  </div>
					  <div class="panel-body">
								 <p> <a>1.Panel content</a></p>
								 <p> <a>2.Panel content</a></p>
								 <p> <a>3.Panel content</a></p>
								 <p> <a>4.Panel content</a></p>
								 <p> <a>5.Panel content</a></p>
								 <p> <a>6.Panel content</a></p>
								 <p> <a>7.Panel content</a></p>
								 <p> <a>8.Panel content</a></p>
								 <p> <a>9.Panel content</a></p>
								 <p> <a>10.Panel content</a></p>
					 </div>
				</div>
			</div>	
			<div class="col-md-4">
					<div class="panel panel-info">
						<div class="panel-heading">
							<h3 class="panel-title">
								最新产品
							 </h3>
						</div>
						  <div class="panel-body">
							 <p> <a>1.Panel content</a></p>
								 <p> <a>2.Panel content</a></p>
								 <p> <a>3.Panel content</a></p>
								 <p> <a>4.Panel content</a></p>
								 <p> <a>5.Panel content</a></p>
								 <p> <a>6.Panel content</a></p>
								 <p> <a>7.Panel content</a></p>
								 <p> <a>8.Panel content</a></p>
								 <p> <a>9.Panel content</a></p>
								 <p> <a>10.Panel content</a></p>
						 </div>
					</div>
			</div>	
		</div>
</div>
  
       
 <footer class="footer ">
   <p>
     <a href="http://www.baidu.com/" target="_blank">京ICP备11008151号</a> | 京公网安备11010802014853
   </p>
 </footer>
<style>
	.footer{background-color: #CCCCCC;}
</style>


	<script type="text/javascript">
			if(window.chrome) {
				$('.banner li').css('background-size', '100% 100%');
			}

	       $('.banner').unslider({
				//arrows: true,
				fluid: true,
				dots: true
			});
	</script>

 </body>
</html>
